import { Component } from '@angular/core';
import { CommonModule } from '@angular/common';

@Component({
  selector: 'app-host-element',
  standalone: true,
  imports: [CommonModule],
  templateUrl: './host-element.component.html',
  styleUrl: './host-element.component.css',
  host: {
    'role': 'slider',
    '[attr.aria-valuenow]': 'value',
    '[tabIndex]': 'disabled ? -1 : 0',
    '(keydown)': "updateValue($event)",
  }
})
export class HostElementComponent {

  value: number = 0;
  disabled: boolean = false;
  updateValue(event: KeyboardEvent) { /* ... */ }

}
